<template>

    <van-sticky>
        <van-nav-bar  :title="data[active].name" left-text="返回" left-arrow @click-left="onClickLeft" />
    </van-sticky>
    <router-view></router-view>
    <!-- 导航 -->
        <van-tabbar v-model="active" router>
            <van-tabbar-item v-for="i in data" :icon="i.icon" :to="i.to">{{ i.name }}</van-tabbar-item>
        </van-tabbar>
    



</template>

<script setup>
import { ref } from 'vue';
import { useRouter } from 'vue-router';
const router = new useRouter()
const onClickLeft = () => router.go(-1);
const active = ref(0);
let data = ([
    {
        to: '/home/shouye',
        icon: 'wap-home-o',
        name: '首页',
    }, 
    {
        to: '/home/class',
        icon: 'bag-o',
        name: '分类',
    },
    {
        to: '/home/wode',
        icon: 'friends-o',
        name: '我的',
    },
    {
        to: '/home/shop',
        icon: 'shopping-cart-o',
        name: '购物车',
    },
   
])
</script>

<style lang="scss" scoped></style>